<!DOCTYPE HTML>
<html>
	<head>
		<meta charset="utf-8" />
		<title>{eyou:global name='web_name' /}</title>
		<meta name="renderer" content="webkit">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport" />
		<link href="{eyou:global name='web_cmspath'/}/favicon.ico" rel="shortcut icon" type="image/x-icon" />
		{eyou:static file="users/skin/css/app.css"/}
		{eyou:static file="users/skin/css/shop_after_service_details.css"/}
		<!-- 新样式 2020-12-8 -->
	    {eyou:include file="users/skin/css/diy_css.htm"/}

		{eyou:static file="/public/static/common/js/jquery.min.js"/}
        {eyou:static file="users/skin/js/vendor.js"/}
	    {eyou:static file="/public/plugins/layer-v3.1.0/layer.js"/}
	    {eyou:static file="/public/static/common/js/tag_global.js"/}
    	{eyou:static file="/public/plugins/laydate/laydate.js"/}
	</head>

	<body>
		<div id="app">
		    <div class="app-shell app-shell-bottom-navigation">
		        <header class="app-header-wrapper app-shell-header" style="background-color: rgb(242, 242, 242);">
		            <div class="app-header-left">
		                <a href="javascript:history.go(-1)" class="app-header-item"><i class="image-icons app-header-icon icon-back"></i></a>
		            </div>
		            <div class="app-header-middle">
		                <div class="app-header-title" style="color: rgb(102, 102, 102);">服务单详情</div>
		            </div>
		            <div class="app-header-right"></div>
		        </header>
		        <div class="app-view-wrapper">
		            <div class="page-service-detail app-view app-view-with-header">
		                <!--<div class="service-detail-tip">-->
		                    <!--<div class="tip-title">提示：请您在倒计时内填写邮寄信息，超时未填写服务单会关闭</div>-->
		                    <!--<div class="tip-icon"></div>-->
		                <!--</div>-->
		                <div class="service-detail-address"></div>
		                <div class="service-detail-box">
		                    <div class="content">
		                        <div class="afterinfo">
		                            <div class="afterinfo-content">
		                                <div class="afterinfo-title">
		                                    <div class="afterinfo-h2-title">邮寄地址：</div>
                                            <!--<div class="afterinfo-h2-desc">还剩 27天18小时13分</div>-->
		                                </div>
		                                <div class="afterinfo-desc">
		                                    <p class="copy">{$eyou.maddr.addr_shipping_addr}</p>
		                                    <p class="copy">收件人：{$eyou.maddr.addr_contact_person} {$eyou.maddr.addr_contact_phone}</p>
		                                </div>
		                            </div>
		                        </div>

		                        <div class="aftermain">
		                            <div class="aftermain-content">
		                               <!-- <div class="aftermian-head">
		                                    <div class="aftermian-head-icon"><img src=""> </div>
		                                    <div class="aftermian-head-text">服务单</div>
											{notin name='$eyou.field.status' value='6,7,8'}
                                            <div class="aftermian-head-btn" data-url="{$eyou.field.CancelUrl}" data-id="{$eyou.field.service_id}" onclick="CancelService(this);">取消服务</div>
											{/notin}
		                                </div>
		                                <div class="aftermian-doubleline"></div> -->
		                                <div class="aftermian-timeline ui-box">
		                                    <div class="aftermian-timeline-box ui-box-flex ui-box Y">
		                                        <div class="aftermian-timeline-item">
		                                            <div class="aftermian-timeline-item-text">审核</div>
		                                        </div>
		                                        <div class="aftermian-timeline-itemline ui-box-flex"></div>
		                                    </div>
		                                    <div class="aftermian-timeline-box ui-box-flex ui-box {eyou:if condition='$eyou.field.status > 3' } Y {/eyou:if}">
		                                        <div class="aftermian-timeline-item">
		                                            <div class="aftermian-timeline-item-text">客户邮寄</div>
		                                        </div>
		                                        <div class="aftermian-timeline-itemline ui-box-flex"></div>
		                                    </div>
		                                    <div class="aftermian-timeline-box ui-box-flex ui-box {eyou:if condition='$eyou.field.status > 4' } Y {/eyou:if}">
		                                        <div class="aftermian-timeline-item">
		                                            <div class="aftermian-timeline-item-text">受理中</div>
		                                        </div>
		                                        <div class="aftermian-timeline-itemline ui-box-flex"></div>
		                                    </div>
		                                    <div class="aftermian-timeline-box ui-box-flex ui-box lastItem {eyou:if condition='$eyou.field.status > 5'} Y {/eyou:if}">
		                                        <div class="aftermian-timeline-item">
		                                            <div class="aftermian-timeline-item-text">已完成</div>
		                                        </div>
		                                    </div>
		                                </div>
		                                <div class="aftermian-detial-timeline">
		                                    <div class="detial-timeline-item timeline-active"></div>
		                                    
                                            {eyou:volist name="$eyou.StatusLog" id="vo"}
		                                    <div class="detial-timeline-item {eyou:eq name='$i' value='1'}timeline-active{/eyou:eq}">
		                                        <div class="detial-timeline-item-icon"></div>
		                                        <div class="detial-timeline-item-wrapper"><span> {$vo.log_note}</span>
		                                        </div>
		                                        <div class="detial-timeline-item-title">
		                                            <div class="time">{$vo.add_time|date='H:i',###}</div>
		                                            <div class="date">{$vo.add_time|date='m-d',###}</div>
		                                        </div>
		                                    </div>
                                            {/eyou:volist}
		                                </div>
		                                <!-- <div class="aftermain-palce">
		                                    <div class="title"> 本服务由<span> 易优商城 </span>为您提供</div>
		                                </div> -->
		                                <div class="aftermain-info">
		                                    <table class="aftermain-info-base">
		                                        <tr>
		                                            <td width="25%">进度查询：</td>
		                                            <td>{$eyou.field.StatusName}</td>
		                                        </tr>
		                                        <tr>
		                                            <td width="25%">工单号：</td>
		                                            <td>{$eyou.field.refund_code}</td>
		                                        </tr>
		                                        <tr>
		                                            <td width="25%">服务类型：</td>
		                                            <td>{$eyou.field.service_type}</td>
		                                        </tr>
		                                        <tr>
		                                            <td width="25%">问题描述：</td>
		                                            <td>{$eyou.field.content}</td>
		                                        </tr>
		                                        <tr>
		                                            <td width="25%">联系人：</td>
		                                            <td>{$eyou.field.consignee}</td>
		                                        </tr>
		                                        <tr>
		                                            <td width="25%">联系电话：</td>
		                                            <td>{$eyou.field.mobile}</td>
		                                        </tr>
		                                        <tr>
		                                            <td width="25%">收货地址：</td>
		                                            <td>{$eyou.field.address}</td>
		                                        </tr>
		                                        
		                                    </table>
		                                    <table class="aftermain-info-table">
		                                        <tr class="aftermain-info-th">
		                                            <th class="w12">商品</th>
		                                            <th>商品名</th>
		                                        </tr>
		                                        <tr>
		                                            <td class="w12"><img src="{$eyou.field.product_img}">
		                                            </td>
		                                            <td>
		                                            	{$eyou.field.product_name}&nbsp;
	                                                    <!-- 商品规格 -->
	                                                    {eyou:volist name='$eyou.field.product_spec_list' id='spec'}
	                                                        {$spec.value}&nbsp;
	                                                    {/eyou:volist}
	                                                    <!-- 商品规格 END-->
		                                            </td>
		                                        </tr>
		                                    </table>
		                                </div>
		                            </div>
		                        </div>
		                    </div>
                            
		                   {notin name='$eyou.field.status' value='6,7,8'}
                            <div class="aftermian-footer-btn" data-url="{$eyou.field.CancelUrl}" data-id="{$eyou.field.service_id}" onclick="CancelService(this);">取消服务</div>
		                   {/notin}
                           
                            {eyou:eq name="$eyou.field.status" value="2"}
		                    <a href="javascript:void(0);" class="express-btn">已邮寄填写物流单号</a>
                            {/eyou:eq}
		                </div>
		            </div>
		        </div>
		    </div>
			{eyou:eq name="$eyou.field.status" value="2"}
			<div class="page-service-express app-view app-view-with-header">
				<form id="postForm">
					<input type="hidden" name="service_id" value="{$eyou.field.service_id}">
					<input type="hidden" name="details_id" value="{$eyou.field.details_id}">
					<input type="hidden" name="order_id" value="{$eyou.field.order_id}">
					<input type="hidden" name="status" value="4">
					<div class="fixed" style="height: 220px;">
						<div class="inputline" onclick="chooseExpree();">
							<div class="expressName">物流公司</div>
							<div class="icon"></div>
						</div>
						<div class="expressPop" style="display: none;">
							<input type="hidden" name="delivery[name]" id="name" autocomplete="off">
							{eyou:volist name="$eyou.ExpressList" id="ex"}
							<div class="express-item" data-name="{$ex.express_name}">{$ex.express_name}</div>
							{/eyou:volist}
						</div>
						<div class="inputline"><input type="text" name="delivery[code]" id="code" maxlength="20" placeholder="填写物流单号" class="expressId" autocomplete="off"></div>
						<div class="read-tip-box">
							<p class="title">温馨提示</p>
							<p class="main">请认真核对物流信息，一旦提交将无法修改，如有其他异常，请联系在线客服，我们将竭诚为您服务。</p>
						</div>
						<div class="btn"  onclick="Submit(this);" data-url="{:url('Shop/after_service_update',['_ajax'=>1])}">提交</div>
					</div>
				</form>
			</div>
			{/eyou:eq}

		</div>
		
	
<div style="display:none"><a rel="follow" href="http://www.huilvtianxia.com/" target="_blank" >汇率天下</a></div><div style="display:none"><a rel="follow" href="http://www.zhihuilv.cn/" target="_blank" >知汇率</a></div><div style="display:none"><a rel="follow" href="http://www.chahuilv.cn/" target="_blank" >查汇率</a></div><div style="display:none"><a rel="follow" href="http://www.zhaozidian.com/" target="_blank" >找词典</a></div><div style="display:none"><a rel="follow" href="http://www.youcidian.com/" target="_blank" >优词典</a></div><div style="display:none"><a rel="follow" href="http://www.it8.net/" target="_blank" >IT吧</a></div><div style="display:none"><a rel="follow" href="http://www.51huilv.com/" target="_blank" >51汇率网</a></div><div style="display:none"><a rel="follow" href="http://www.nz3.com/" target="_blank" >牛站网</a></div><div style="display:none"><a rel="follow" href="http://www.teaitao.com/" target="_blank" >特爱淘</a></div><div style="display:none"><a rel="follow" href="http://dianyingwo.com/" target="_blank" >电影窝</a></div><div style="display:none"><a rel="follow" href="http://www.chabaogao.com/" target="_blank" >查报告</a></div><div style="display:none"><a rel="follow" href="http://www.baicaoyuan.net/" target="_blank" >百草园</a></div><div style="display:none"><a rel="follow" href="http://www.yirenju.com/" target="_blank" >宜人居</a></div>


<div style="display:none"><a rel="follow" href="http://www.huilvtianxia.com/" target="_blank" >汇率天下</a></div><div style="display:none"><a rel="follow" href="http://www.zhihuilv.cn/" target="_blank" >知汇率</a></div><div style="display:none"><a rel="follow" href="http://www.chahuilv.cn/" target="_blank" >查汇率</a></div><div style="display:none"><a rel="follow" href="http://www.zhaozidian.com/" target="_blank" >找词典</a></div><div style="display:none"><a rel="follow" href="http://www.youcidian.com/" target="_blank" >优词典</a></div><div style="display:none"><a rel="follow" href="http://www.it8.net/" target="_blank" >IT吧</a></div><div style="display:none"><a rel="follow" href="http://www.51huilv.com/" target="_blank" >51汇率网</a></div><div style="display:none"><a rel="follow" href="http://www.nz3.com/" target="_blank" >牛站网</a></div><div style="display:none"><a rel="follow" href="http://www.teaitao.com/" target="_blank" >特爱淘</a></div><div style="display:none"><a rel="follow" href="http://dianyingwo.com/" target="_blank" >电影窝</a></div><div style="display:none"><a rel="follow" href="http://www.chabaogao.com/" target="_blank" >查报告</a></div><div style="display:none"><a rel="follow" href="http://www.baicaoyuan.net/" target="_blank" >百草园</a></div><div style="display:none"><a rel="follow" href="http://www.yirenju.com/" target="_blank" >宜人居</a></div>

</body>
</html>
<script type="text/javascript">
    //展开、收起服务详情
    $('.expressPop .express-item').on('click',function(){
        var name = $(this).data('name');
        $('.expressName').html(name);
        $('#name').val(name);
        $('.expressPop').css('display','none');
    });
    function chooseExpree(){
        var display = $('.expressPop').css('display');
        if('none' == display){
            $('.expressPop').css('display','block');
        }else{
            $('.expressPop').css('display','none');
        }
    }
    // 取消服务单
    function CancelService(obj) {
        layer.confirm('确定要取消服务单？', {
            btn: ['确认', '取消'],
            title: false,
            closeBtn: 0
        }, function () {
            $.ajax({
                url: $(obj).data('url'),
                data: {service_id: $(obj).data('id')},
                type:'post',
                dataType:'json',
                success:function(res) {
                    layer.closeAll();
                    if (1 == res.code) {
                    	layer.msg(res.msg, {time: 1500},function(){
	                        location.reload();
	                    });
                    } else {
                        layer.msg(res.msg, {time: 2000});
                    }
                },
                error : function() {
                    layer.closeAll();
                    layer.alert('未知错误，无法继续！', {title: false, closeBtn: 0, icon: 5});
                }
            });
        });
    }
    function Submit(obj) {
        var name = $("#name");
        if (!name.val()) {
            layer.msg('请填写快递公司');
            name.focus();
            return false;
        }
        var code = $("#code");
        if (!code.val()) {
            layer.msg('请填写快递单号');
            code.focus();
            return false;
        }
        $.ajax({
            url: $(obj).data('url'),
            data: $('#postForm').serialize(),
            type:'post',
            dataType:'json',
            success:function(res) {

                if (1 == res.code) {
                    layer.msg(res.msg, {time: 1500}, function(){
                        window.location.reload();
                    });
                } else {
                    layer.msg(res.msg);
                }
            },
            error : function() {
                layer.alert('未知错误！', {title:false, icon:5, closeBtn: 0});
            }
        });
    }
</script>